
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>merry christmas</title>
  <style>
    /* colors */
    .headline {
    margin-bottom: 0.5em;
    color: #b81313;
    font-family: "Berkshire Swash", cursive;
    font-weight: normal;
    text-align: center;
    text-shadow: 0 0.05em 0.1em #fff;
    animation-name: hover;
    animation-iteration-count: infinite;
    animation-duration: 3.5s;
}
  #css1 {
    margin-bottom: 0.5em;
    color: deepskyblue;
    font-family: "Berkshire Swash", cursive;
    font-weight: normal;
    text-align: center;
    text-shadow: 0 0.05em 0.1em #fff;
    animation-name: hover;
    animation-iteration-count: infinite;
    animation-duration: 3.5s;
}
:root{
  --brown: #391B08;
  --white: #FFF1EF;
  --red: #A40000;
  --gold: #FFD500;
  --skin: #FFE9A8;
  --grey: #CFC4C2;
  --black: #000000;
}

/* page setup */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box }
body { height: 100vh; display: grid; place-items: center; background-color: #1D1E22 }

/* scene set-up */
[scene], [rotation], [center-z] { display: grid }
[scene] :not(:empty) { transform-style: preserve-3d }
[scene] { width: var(--size); perspective: calc(var(--size) * 2); aspect-ratio: 1 }

/* rotate/animate scene  */
[rotation][animate="true"] {
  transform: rotateY(-90deg);
  animation: rotateScene 9s linear infinite }
@keyframes rotateScene{ to { transform: rotateY(270deg) } }
[rotation] { transform: rotateX(-0deg) }

/* position contents to z-center */
[center-z] { transform: translateZ(calc(var(--size) * .5)) }

/* grid */
[grid] {
  display: grid;
  grid-template-columns: repeat(var(--dimension), 1fr);
  grid-template-rows: repeat(var(--dimension), 1fr);
}

/* layer */
[layer] { display: contents}

/* pixel */
[pixel] {
  --pixel-size: calc(var(--size) / var(--dimension));
  grid-row: calc(var(--dimension) - var(--l) + 1);
  grid-column: var(--c);
  --row: calc(var(--dimension) - var(--r));
  --translateZ:  translateZ(calc(var(--pixel-size) * var(--row) * -1));
  transform: var(--translateZ);
  background-color: var(--color);
}

/* sides set up */
[pixel], [pixel] > span { display: grid;  }
[pixel] > span { background-color: inherit; transform-style: preserve-3d }
[pixel]::before, [pixel]::after, [pixel] > span::before, [pixel] > span::after { content: ""; background-color: inherit }
[pixel]::before, [pixel]::after, [pixel] > span, [pixel] > span::before, [pixel] > span::after { grid-area: 1/1 }

/*sides orientation*/
[pixel]::before { transform-origin: left; transform: rotateY(90deg) } /*left*/
[pixel]::after { transform-origin: right; transform: rotateY(-90deg) } /*right*/
[pixel] > span { transform: translateZ(calc(var(--pixel-size) * -1)) } /*back*/
[pixel] > span::before { transform-origin: top; transform: rotateX(90deg) } /*top*/
[pixel] > span::after { transform-origin: bottom; transform: rotateX(-90deg) } /*bottom*/

/* shading */
[pixel]::after{ background-image: linear-gradient(rgb(0 0 0 / .25) 100%, transparent) }/*right*/
[pixel] > span::after { background-image: linear-gradient(rgb(0 0 0 / .375) 100%, transparent) }/*bottom*/

/*lighting*/
[pixel]::before { background-image: linear-gradient(rgb(255 255 255 / .25) 100%, transparent) }/*left*/
[pixel] > span::before { background-image: linear-gradient(rgb(255 255 255 / .375) 100%, transparent) }/*top*/

/* floor */
[grid]::after{
  content: "";
  grid-area: 1/1/-1/-1;
  border-radius: 50%;
/*   opacity: 0.5; */
  --neg-half-size: calc(var(--size) / -2);
  transform: rotateX(90deg) translateZ(var(--neg-half-size)) translateY(var(--neg-half-size));
  --pixel-size: calc(var(--size) / var(--dimension) * 4);
  --clr1: hsl(0 0% 100%);
  --clr2: hsl(0 0% 90%);
  --clr3: hsl(0 0% 80%);
  --clr4: hsl(0 0% 70%);
  background-image: conic-gradient( var(--clr1) 90deg , var(--clr2) 0 180deg , var(--clr3) 0 270deg, var(--clr4) 0 360deg);
  background-size: var(--pixel-size) var(--pixel-size);
  box-shadow: 0 0 5vmin 0 black, 0 0 50vmax 0 rgb(255 255 255 / .8);
}
  </style>
</head>
<body>
<h1 class="headline">Merry Christmas!</h1>
<h1 id="css1">点击屏幕有惊喜</h1>
<script>

 function snow() {
  // 1、定义一片雪花模板
  var flake = document.createElement('div1');
  // 雪花字符 ❄❉❅❆✻✼❇❈❊✥✺
  flake.innerHTML = '❅';
  flake.style.cssText = 'position:absolute;color:#fff;';

  //获取页面的高度 相当于雪花下落结束时Y轴的位置
  var documentHieght = window.innerHeight;
  //获取页面的宽度，利用这个数来算出，雪花开始时left的值
  var documentWidth = window.innerWidth;

  //定义生成一片雪花的毫秒数
  var millisec =25;
  //2、设置第一个定时器，周期性定时器，每隔一段时间（millisec）生成一片雪花；
  setInterval(function() { //页面加载之后，定时器就开始工作
  //随机生成雪花下落 开始 时left的值，相当于开始时X轴的位置
  var startLeft = Math.random() * documentWidth;

  //随机生成雪花下落 结束 时left的值，相当于结束时X轴的位置
  var endLeft = Math.random() * documentWidth;

  //随机生成雪花大小
  var flakeSize = 30 + 20 * Math.random();

  //随机生成雪花下落持续时间
  var durationTime = 7000 + 7000 * Math.random();

  //随机生成雪花下落 开始 时的透明度
  var startOpacity = 0.7 + 0.3 * Math.random();

  //随机生成雪花下落 结束 时的透明度
  var endOpacity = 0.01;

  //克隆一个雪花模板
  var cloneFlake = flake.cloneNode(true);

  //第一次修改样式，定义克隆出来的雪花的样式
  cloneFlake.style.cssText += `
   left: ${startLeft}px;
   opacity: ${startOpacity};
   font-size:${flakeSize}px;
   top:-25px;
    transition:${durationTime}ms;`;

  //拼接到页面中
  document.body.appendChild(cloneFlake);

  //设置第二个定时器，一次性定时器，
  //当第一个定时器生成雪花，并在页面上渲染出来后，修改雪花的样式，让雪花动起来；
  setTimeout(function() {
   //第二次修改样式
   cloneFlake.style.cssText += `
    left: ${endLeft}px;
    top:${documentHieght}px;
    opacity:${endOpacity};`;

   //4、设置第三个定时器，当雪花落下后，删除雪花。
   setTimeout(function() {
   cloneFlake.remove();
   }, durationTime);
  }, 0);

  }, millisec);
 }
 snow();
 </script>
<audio id="bgmusic" src="https://files.freemusicarchive.org/storage-freemusicarchive-org/music/no_curator/Dott/This_Christmas/Dott_-_01_-_This_Christmas.mp3" autoplay="autoplay" loop="loop" style="display: block; width: 3%; height:3%;"></audio>
    <script type="text/javascript">
  function toggleSound() {
            var music = document.getElementById("bgmusic");//获取ID
                console.log(music);
                console.log(music.paused);
            if (music.paused) { //判读是否播放
                music.paused=false;
                music.play(); //没有就播放
            }

        }
setInterval("toggleSound()",1);
 </script>
<div scene style="--size: 60vmin">
  <div rotation animate="true">
    <div center-z>
      <div grid style="--dimension: 26">
        <!--l: layers counted from bottom to top -->
        <!--r: row counted from back to front -->
        <!--c: column counted from left to right -->
        <div layer style="--l: 1">
          <div pixel style="--r: 13; --c:11; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 13; --c:12; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 13; --c:15; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 13; --c:16; --color: var(--brown)"><span></span></div>

          <div pixel style="--r: 14; --c:11; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 14; --c:12; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 14; --c:15; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 14; --c:16; --color: var(--brown)"><span></span></div>

          <div pixel style="--r: 15; --c:11; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 15; --c:12; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 15; --c:15; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 15; --c:16; --color: var(--brown)"><span></span></div>

          <div pixel style="--r: 16; --c:11; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 16; --c:12; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 16; --c:15; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 16; --c:16; --color: var(--brown)"><span></span></div>
        </div>

        <div layer style="--l: 2">
          <div pixel style="--r: 13; --c:11; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 13; --c:12; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 13; --c:15; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 13; --c:16; --color: var(--brown)"><span></span></div>

          <div pixel style="--r: 14; --c:11; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 14; --c:12; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 14; --c:15; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 14; --c:16; --color: var(--brown)"><span></span></div>

          <div pixel style="--r: 15; --c:11; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 15; --c:12; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 15; --c:15; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 15; --c:16; --color: var(--brown)"><span></span></div>

          <div pixel style="--r: 16; --c:11; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 16; --c:12; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 16; --c:15; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 16; --c:16; --color: var(--brown)"><span></span></div>
        </div>

        <div layer style="--l: 3">
          <div pixel style="--r: 13; --c:11; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 13; --c:12; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 13; --c:15; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 13; --c:16; --color: var(--white)"><span></span></div>

          <div pixel style="--r: 14; --c:11; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 14; --c:12; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 14; --c:15; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 14; --c:16; --color: var(--white)"><span></span></div>
        </div>

        <div layer style="--l: 4">
          <div pixel style="--r: 13; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 14; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:16; --color: var(--red)"><span></span></div>
        </div>

        <div layer style="--l: 5">
          <div pixel style="--r: 13; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 14; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:16; --color: var(--red)"><span></span></div>
        </div>

        <div layer style="--l: 6">
          <div pixel style="--r: 13; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 14; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:16; --color: var(--red)"><span></span></div>
        </div>

        <div layer style="--l: 7">
          <div pixel style="--r: 12; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 13; --c:9; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 13; --c:10; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 13; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:17; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 13; --c:18; --color: var(--brown)"><span></span></div>

          <div pixel style="--r: 14; --c:9; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 14; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:18; --color: var(--brown)"><span></span></div>

          <div pixel style="--r: 15; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 15; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 15; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 15; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 15; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 15; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 16; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:15; --color: var(--red)"><span></span></div>
        </div>

        <div layer style="--l: 8">
          <div pixel style="--r: 12; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 13; --c:9; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 13; --c:10; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 13; --c:17; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 13; --c:18; --color: var(--brown)"><span></span></div>

          <div pixel style="--r: 14; --c:9; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 14; --c:10; --color: var(--brown)"><span></span></div>

          <div pixel style="--r: 14; --c:17; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 14; --c:18; --color: var(--brown)"><span></span></div>

          <div pixel style="--r: 15; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 15; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 16; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:16; --color: var(--red)"><span></span></div>
        </div>

        <div layer style="--l: 9">
          <div pixel style="--r: 12; --c:11; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 12; --c:12; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 12; --c:13; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 12; --c:14; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 12; --c:15; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 12; --c:16; --color: var(--brown)"><span></span></div>

          <div pixel style="--r: 13; --c:9; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 13; --c:10; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 13; --c:17; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 13; --c:18; --color: var(--white)"><span></span></div>

          <div pixel style="--r: 14; --c:9; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 14; --c:10; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 14; --c:17; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 14; --c:18; --color: var(--white)"><span></span></div>

          <div pixel style="--r: 15; --c:11; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 15; --c:16; --color: var(--brown)"><span></span></div>

          <div pixel style="--r: 16; --c:11; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 16; --c:12; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 16; --c:13; --color: var(--gold)"><span></span></div>
          <div pixel style="--r: 16; --c:14; --color: var(--gold)"><span></span></div>
          <div pixel style="--r: 16; --c:15; --color: var(--brown)"><span></span></div>
          <div pixel style="--r: 16; --c:16; --color: var(--brown)"><span></span></div>
        </div>

        <div layer style="--l: 10">
          <div pixel style="--r: 12; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 13; --c:9; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:17; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:18; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 14; --c:9; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:17; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:18; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 15; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 15; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 16; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:16; --color: var(--red)"><span></span></div>
        </div>

        <div layer style="--l: 11">
          <div pixel style="--r: 12; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 13; --c:9; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:17; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:18; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 14; --c:9; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:17; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:18; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 15; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 15; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 16; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 17; --c:13; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 17; --c:14; --color: var(--grey)"><span></span></div>
        </div>

        <div layer style="--l: 12">
          <div pixel style="--r: 12; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 13; --c:9; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:17; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:18; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 14; --c:9; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:17; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:18; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 15; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 15; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 16; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:15; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 17; --c:12; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 17; --c:13; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 17; --c:14; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 17; --c:15; --color: var(--grey)"><span></span></div>
        </div>

        <div layer style="--l: 13">
          <div pixel style="--r: 12; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 13; --c:9; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:17; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:18; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 14; --c:9; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:17; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:18; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 15; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 15; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 16; --c:11; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 16; --c:16; --color: var(--grey)"><span></span></div>

          <div pixel style="--r: 17; --c:12; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 17; --c:13; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 17; --c:14; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 17; --c:15; --color: var(--grey)"><span></span></div>
        </div>

        <div layer style="--l: 14">
          <div pixel style="--r: 12; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 13; --c:9; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:17; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:18; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 14; --c:9; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:17; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:18; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 15; --c:10; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 15; --c:17; --color: var(--grey)"><span></span></div>

          <div pixel style="--r: 16; --c:10; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 16; --c:17; --color: var(--grey)"><span></span></div>

          <div pixel style="--r: 17; --c:11; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 17; --c:12; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 17; --c:13; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 17; --c:14; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 17; --c:15; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 17; --c:16; --color: var(--grey)"><span></span></div>
        </div>

        <div layer style="--l: 15">
          <div pixel style="--r: 11; --c:11; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 11; --c:12; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 11; --c:13; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 11; --c:14; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 11; --c:15; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 11; --c:16; --color: var(--grey)"><span></span></div>

          <div pixel style="--r: 12; --c:11; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 12; --c:16; --color: var(--grey)"><span></span></div>

          <div pixel style="--r: 13; --c:11; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 13; --c:16; --color: var(--grey)"><span></span></div>

          <div pixel style="--r: 14; --c:10; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 14; --c:17; --color: var(--grey)"><span></span></div>

          <div pixel style="--r: 15; --c:10; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 15; --c:17; --color: var(--grey)"><span></span></div>

          <div pixel style="--r: 16; --c:10; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 16; --c:17; --color: var(--grey)"><span></span></div>

          <div pixel style="--r: 17; --c:11; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 17; --c:12; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 17; --c:13; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 17; --c:14; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 17; --c:15; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 17; --c:16; --color: var(--grey)"><span></span></div>
        </div>

        <div layer style="--l: 16">
          <div pixel style="--r: 11; --c:11; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 11; --c:12; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 11; --c:13; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 11; --c:14; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 11; --c:15; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 11; --c:16; --color: var(--grey)"><span></span></div>

          <div pixel style="--r: 12; --c:11; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 12; --c:16; --color: var(--grey)"><span></span></div>

          <div pixel style="--r: 13; --c:10; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 13; --c:17; --color: var(--grey)"><span></span></div>

          <div pixel style="--r: 14; --c:10; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 14; --c:17; --color: var(--grey)"><span></span></div>

          <div pixel style="--r: 15; --c:10; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 15; --c:17; --color: var(--grey)"><span></span></div>

          <div pixel style="--r: 16; --c:11; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 16; --c:16; --color: var(--skin)"><span></span></div>

          <div pixel style="--r: 17; --c:12; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 17; --c:15; --color: var(--grey)"><span></span></div>

          <div pixel style="--r: 18; --c:13; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 18; --c:14; --color: var(--skin)"><span></span></div>
        </div>

        <div layer style="--l: 17">
          <div pixel style="--r: 11; --c:11; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 11; --c:12; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 11; --c:13; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 11; --c:14; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 11; --c:15; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 11; --c:16; --color: var(--grey)"><span></span></div>

          <div pixel style="--r: 12; --c:11; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 12; --c:16; --color: var(--grey)"><span></span></div>

          <div pixel style="--r: 13; --c:10; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 13; --c:17; --color: var(--grey)"><span></span></div>

          <div pixel style="--r: 14; --c:10; --color: var(--grey)"><span></span></div>
          <div pixel style="--r: 14; --c:17; --color: var(--grey)"><span></span></div>

          <div pixel style="--r: 15; --c:11; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 15; --c:16; --color: var(--skin)"><span></span></div>

          <div pixel style="--r: 16; --c:11; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 16; --c:12; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 16; --c:15; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 16; --c:16; --color: var(--skin)"><span></span></div>

          <div pixel style="--r: 17; --c:13; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 17; --c:14; --color: var(--skin)"><span></span></div>

          <div pixel style="--r: 18; --c:13; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 18; --c:14; --color: var(--skin)"><span></span></div>
        </div>

        <div layer style="--l: 18">
          <div pixel style="--r: 10; --c:11; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 10; --c:12; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 10; --c:13; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 10; --c:14; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 10; --c:15; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 10; --c:16; --color: var(--white)"><span></span></div>

          <div pixel style="--r: 11; --c:10; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 11; --c:17; --color: var(--white)"><span></span></div>

          <div pixel style="--r: 12; --c:10; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 12; --c:17; --color: var(--white)"><span></span></div>

          <div pixel style="--r: 13; --c:11; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 13; --c:16; --color: var(--skin)"><span></span></div>

          <div pixel style="--r: 14; --c:11; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 14; --c:16; --color: var(--skin)"><span></span></div>

          <div pixel style="--r: 15; --c:11; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 15; --c:16; --color: var(--skin)"><span></span></div>

          <div pixel style="--r: 16; --c:11; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 16; --c:12; --color: var(--black)"><span></span></div>
          <div pixel style="--r: 16; --c:13; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 16; --c:14; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 16; --c:15; --color: var(--black)"><span></span></div>
          <div pixel style="--r: 16; --c:16; --color: var(--white)"><span></span></div>
        </div>

        <div layer style="--l: 19">
          <div pixel style="--r: 10; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 10; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 10; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 10; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 10; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 10; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 11; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 11; --c:17; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 12; --c:10; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 12; --c:17; --color: var(--white)"><span></span></div>

          <div pixel style="--r: 13; --c:10; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 13; --c:17; --color: var(--white)"><span></span></div>

          <div pixel style="--r: 14; --c:11; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 14; --c:16; --color: var(--skin)"><span></span></div>

          <div pixel style="--r: 15; --c:11; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 15; --c:16; --color: var(--skin)"><span></span></div>

          <div pixel style="--r: 16; --c:11; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 16; --c:12; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 16; --c:13; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 16; --c:14; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 16; --c:15; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 16; --c:16; --color: var(--white)"><span></span></div>
        </div>

        <div layer style="--l: 20">
          <div pixel style="--r: 10; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 10; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 10; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 10; --c:15; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 11; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 11; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 11; --c:16; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 11; --c:17; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 12; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:17; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 13; --c:10; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 13; --c:17; --color: var(--white)"><span></span></div>

          <div pixel style="--r: 14; --c:10; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 14; --c:17; --color: var(--white)"><span></span></div>

          <div pixel style="--r: 15; --c:10; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 15; --c:17; --color: var(--white)"><span></span></div>

          <div pixel style="--r: 16; --c:10; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 16; --c:11; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 16; --c:12; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 16; --c:13; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 16; --c:14; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 16; --c:15; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 16; --c:16; --color: var(--skin)"><span></span></div>
          <div pixel style="--r: 16; --c:17; --color: var(--white)"><span></span></div>
        </div>

        <div layer style="--l: 21">
          <div pixel style="--r: 11; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 11; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 11; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 11; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 11; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 11; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 12; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:17; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 13; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:17; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 14; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:17; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 15; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 15; --c:17; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 16; --c:10; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 16; --c:17; --color: var(--white)"><span></span></div>

          <div pixel style="--r: 17; --c:11; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 17; --c:12; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 17; --c:13; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 17; --c:14; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 17; --c:15; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 17; --c:16; --color: var(--white)"><span></span></div>
        </div>

        <div layer style="--l: 22">
          <div pixel style="--r: 9; --c:13; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 9; --c:14; --color: var(--white)"><span></span></div>

          <div pixel style="--r: 10; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 10; --c:14; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 11; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 11; --c:15; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 12; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 13; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:17; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 14; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:17; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 15; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 15; --c:17; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 16; --c:10; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:17; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 17; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 17; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 17; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 17; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 17; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 17; --c:16; --color: var(--red)"><span></span></div>
        </div>

        <div layer style="--l: 23">
          <div pixel style="--r: 9; --c:13; --color: var(--white)"><span></span></div>
          <div pixel style="--r: 9; --c:14; --color: var(--white)"><span></span></div>

          <div pixel style="--r: 10; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 10; --c:14; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 11; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 11; --c:14; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 12; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:15; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 13; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 14; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 15; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 15; --c:16; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 16; --c:11; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:15; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 16; --c:16; --color: var(--red)"><span></span></div>
        </div>

        <div layer style="--l: 24">
          <div pixel style="--r: 11; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 11; --c:14; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 12; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 12; --c:14; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 13; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:15; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 14; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:15; --color: var(--red)"><span></span></div>

          <div pixel style="--r: 15; --c:12; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 15; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 15; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 15; --c:15; --color: var(--red)"><span></span></div>
        </div>

        <div layer style="--l: 25">
          <div pixel style="--r: 13; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 13; --c:14; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:13; --color: var(--red)"><span></span></div>
          <div pixel style="--r: 14; --c:14; --color: var(--red)"><span></span></div>
        </div>
      </div>



</body>
</html>